<template>
<div class="PxDdiv1">
    <el-col :span="6" class="col1">
        <img src="../../../assets/phone/mainb.png" class="imgb" v-show="Downimgshow.mainb" @click="gomain">
        <img src="../../../assets/phone/maina.png" class="imga" v-show="Downimgshow.maina">
    </el-col>
    <el-col :span="6" class="col1">
        <img src="../../../assets/phone/cartb.png" class="imgb" v-show="Downimgshow.cartb" style="margin-left:80px" @click="gocart">
        <img src="../../../assets/phone/carta.png" class="imga" v-show="Downimgshow.carta" style="margin-left:80px">
    </el-col>
    <el-col :span="6" class="col1">
        <img src="../../../assets/phone/orderb.png" class="imgb" v-show="Downimgshow.orderb" style="margin-left:160px" @click="goorder">
        <img src="../../../assets/phone/ordera.png" class="imga" v-show="Downimgshow.ordera" style="margin-left:160px">
    </el-col>
    <el-col :span="6" class="col1">
        <img src="../../../assets/phone/myb.png" class="imgb" v-show="Downimgshow.myb" style="margin-left:240px" @click="gomy">
        <img src="../../../assets/phone/mya.png" class="imga" v-show="Downimgshow.mya" style="margin-left:240px">
    </el-col>
</div>
</template>

<script>
export default {
    name:'PxDown',
    data(){
        return{
            Downimgshow:{'mainb':1,'maina':0,'cartb':1,'carta':0,'orderb':1,'ordera':0,'myb':1,'mya':0},
        }
    },
    methods:{
        gomain(){this.$router.push({name:'PxMain'})},
        gocart(){this.$router.push({name:'PxCart'})},
        goorder(){this.$router.push({name:'PxOrderList'})},
        gomy(){this.$router.push({name:'PxPersionMain'})},
    },
    mounted(){
        this.$bus.$on('Downimgshow',(data)=>{
            this.Downimgshow=data
        })
    },
    beforeDestroy(){
        this.$bus.$off('Downimgshow')
    }
}
</script>

<style scoped>
.PxDdiv1{
    padding-top: 5px;
    background-color: #f4fcff;
    width: 100%;
    height: 50px;
    position: fixed;
    /* top: 0px; */
    bottom: 0px;
    margin-left: -9px;
}
.col1{
    text-align: center;
    background-color: rgb(200, 76, 76);
}
.imgb{
    position: absolute;
    width: 40px;
    height: 40px;
}
.imga{
    position: absolute;
    height: 40px;
    height: 40px;
}
</style>